<template>
  <div class="baycar">
    <!-- <Vanindexbar :list={list} :newPyList={newPyList} /> -->
    <van-index-bar :index-list="newPyList">
      <div v-for="(item, ind) in list" :key="ind">
        <van-index-anchor :index="item.index">{{
          item.index
        }}</van-index-anchor>
        <van-cell
          v-for="(ite, i) in item.children"
          :key="i"
          @click="gotodetail(ite)"
        >
          <img :src="ite.img" alt="" />
          <p>{{ ite.name }}</p>
        </van-cell>
      </div>
    </van-index-bar>
  </div>
</template>

<script>
import Vanindexbar from "../../../components/Vanindexbar.vue"
export default {
  name: "baycar",
    components: {
        Vanindexbar
    },
  data() {
    return {
      list: [],
      newPyList: [],
    };
  },
  mounted() {
    this.list = this.$store.state.list;
    this.newPyList = this.$store.state.newPyList;
    console.log(this.list);
  },
  methods: {
    gotodetail(item) {
      this.$router.push({
        path: "/children",
        query: {
          item: item.childrenNext,
        },
      });
    //   console.log(item);
    },
  },
  created() {
    this.$store.dispatch("GET_LIST");
  },
};
</script>

<style lang="scss" scoped>
.van-cell__value {
  display: flex;
}
</style>